import React from "react";
import PropTypes from "prop-types";
import { connect } from "dva";
import { Row, Col, Button, Table } from "antd";
import { formatDate } from "utils";
import styles from "./index.less";
import { filterState } from "utils/filter";
import moment from "moment";

const Tab = ({ showModal, ...tabProps }) => {
  const columns = [
    {
      title: "申请人",
      dataIndex: "applyName",
      key: "applyName",
      render: (text, record) => {
        const datas = text.split("#")
        const ary = []
        datas.map((item, i) => {
          ary.push(
            <p>{item}</p>
          )
        })
        return ary
      }
    },{
      title:"身份证号码",
      dataIndex:"idcard",
      key:"idcard",
      render: (text, record) => {
        if(!text){
          return null
        }
        const datas = text.split("#")
        const ary = []
        datas.map((item, i) => {
          ary.push(
            <p>{item}</p>
          )
        })
        return ary
      }
    },{
      title:"公证事项",
      dataIndex:"notarialMatters",
      key:"notarialMatters",
      render: (text, record) => {
        const datas = text.split("#")
        const ary = []
        datas.map((item, i) => {
          ary.push(
            <p>{item}</p>
          )
        })
        return ary
      }
    },{
      title:"公证号码",
      dataIndex:"notaryNumber",
      key:"notaryNumber",
      render: (text, record) => {
        const datas = text.split("#")
        const ary = []
        datas.map((item, i) => {
          ary.push(
            <p>{item}</p>
          )
        })
        return ary
      }
    },{
      title:"承办人",
      dataIndex:"contractorUserName",
      key:"contractorUserName",
    },{
      title:"建档人",
      dataIndex:"createdUserName",
      key:"createdUserName",
    },{
      title: "收件日期",
      dataIndex: "createdTime",
      key: "createdTime",
      render: (text, record) => {
        return (
          <p>
            {
              moment(record.createdTime).format("YYYY-MM-DD")
            }
          </p>
        )
      }
    },{
      title: "公证日期",
      dataIndex: "notarizationAt",
      key: "notarizationAt",
      render: (text, record) => {
        return (
          <p>
            {
              moment(record.notarizationAt).format("YYYY-MM-DD")
            }
          </p>
        )
      }
    },
    {
      title: "操作",
      key: "operation",
      render: (record, text) => {
        return (
          <div>
            <a onClick={() => showModal(record)}>申请借阅</a>
          </div>
        );
      }
    }
  ];
  return (
    <div className={styles.wrapTab}>
      <Table columns={columns} {...tabProps} />
    </div>
  );
};

Tab.propTypes = {
  location: PropTypes.object,
  dispatch: PropTypes.func,
  loading: PropTypes.object
};

export default Tab;
